import React from 'react';
import { Form, Button, Upload, message } from 'antd';
import { UploadOutlined } from '@ant-design/icons';
import css from '../index.scss';

/**
 * 停车管理备案中新增备案中相关附件表单
 */
export default () => {
	const propertyRight = {
		headers: {
			authorization: 'authorization-text',
		},
		beforeUpload: () => {
			return false;
		},
		onChange(info) {
			if (info.file.status === 'done') {
				message.success(`${info.file.name} file uploaded successfully`);
			} else if (info.file.status === 'error') {
				message.error(`${info.file.name} file upload failed.`);
			}
		},
	};
	const permissionRight = {
		headers: {
			authorization: 'authorization-text',
		},
		beforeUpload: () => {
			return false;
		},
		onChange(info) {
			if (info.file.status === 'done') {
				message.success(`${info.file.name} file uploaded successfully`);
			} else if (info.file.status === 'error') {
				message.error(`${info.file.name} file upload failed.`);
			}
		},
	};
	const businessLicense = {
		headers: {
			authorization: 'authorization-text',
		},
		beforeUpload: () => {
			return false;
		},
		onChange(info) {
			if (info.file.status === 'done') {
				message.success(`${info.file.name} file uploaded successfully`);
			} else if (info.file.status === 'error') {
				message.error(`${info.file.name} file upload failed.`);
			}
		},
	};
	const recommendation = {
		headers: {
			authorization: 'authorization-text',
		},
		beforeUpload: () => {
			return false;
		},
		onChange(info) {
			if (info.file.status === 'done') {
				message.success(`${info.file.name} file uploaded successfully`);
			} else if (info.file.status === 'error') {
				message.error(`${info.file.name} file upload failed.`);
			}
		},
	};
	const confirmationOfCompletion = {
		headers: {
			authorization: 'authorization-text',
		},
		beforeUpload: () => {
			return false;
		},
		onChange(info) {
			if (info.file.status === 'done') {
				message.success(`${info.file.name} file uploaded successfully`);
			} else if (info.file.status === 'error') {
				message.error(`${info.file.name} file upload failed.`);
			}
		},
	};
	const trafficOrganisationChart = {
		headers: {
			authorization: 'authorization-text',
		},
		beforeUpload: () => {
			return false;
		},
		onChange(info) {
			if (info.file.status === 'done') {
				message.success(`${info.file.name} file uploaded successfully`);
			} else if (info.file.status === 'error') {
				message.error(`${info.file.name} file upload failed.`);
			}
		},
	};
	const parkLotSettingList = {
		headers: {
			authorization: 'authorization-text',
		},
		beforeUpload: () => {
			return false;
		},
		onChange(info) {
			if (info.file.status === 'done') {
				message.success(`${info.file.name} file uploaded successfully`);
			} else if (info.file.status === 'error') {
				message.error(`${info.file.name} file upload failed.`);
			}
		},
	};
	const serviceAndSafeSystem = {
		headers: {
			authorization: 'authorization-text',
		},
		beforeUpload: () => {
			return false;
		},
		onChange(info) {
			if (info.file.status === 'done') {
				message.success(`${info.file.name} file uploaded successfully`);
			} else if (info.file.status === 'error') {
				message.error(`${info.file.name} file upload failed.`);
			}
		},
	};
	const manageOperateMaintainProject = {
		headers: {
			authorization: 'authorization-text',
		},
		beforeUpload: () => {
			return false;
		},
		onChange(info) {
			if (info.file.status === 'done') {
				message.success(`${info.file.name} file uploaded successfully`);
			} else if (info.file.status === 'error') {
				message.error(`${info.file.name} file upload failed.`);
			}
		},
	};
	const emergencyResponsePlan = {
		headers: {
			authorization: 'authorization-text',
		},
		beforeUpload: () => {
			return false;
		},
		onChange(info) {
			if (info.file.status === 'done') {
				message.success(`${info.file.name} file uploaded successfully`);
			} else if (info.file.status === 'error') {
				message.error(`${info.file.name} file upload failed.`);
			}
		},
	};
	const others = {
		headers: {
			authorization: 'authorization-text',
		},
		beforeUpload: () => {
			return false;
		},
		onChange(info) {
			if (info.file.status === 'done') {
				message.success(`${info.file.name} file uploaded successfully`);
			} else if (info.file.status === 'error') {
				message.error(`${info.file.name} file upload failed.`);
			}
		},
	};
	return (
		<div>
			<Form.Item
				label="停车场产权单位证明"
				className={css.item_file}
				name="propertyRight"
				tooltip="请上传证明材料（复印件、盖鲜章）！"
				rules={[{ required: true, message: '停车场产权单位证明不能为空' }]}
			>
				<Upload {...propertyRight}>
					<Button icon={<UploadOutlined />}>上传</Button>
				</Upload>
			</Form.Item>
			<Form.Item
				label="使用权证明材料"
				className={css.item_file}
				name="permissionRight"
				tooltip="请上传管理单位证明：产权单位的委托书、租赁、隶属、自营、共有、抵押等使用权证明材料（复印件、盖鲜章）"
				rules={[{ required: true, message: '使用权证明材料不能为空' }]}
			>
				<Upload {...permissionRight}>
					<Button icon={<UploadOutlined />}>上传</Button>
				</Upload>
			</Form.Item>
			<Form.Item className={css.item_file}>
				<></>
			</Form.Item>
			<Form.Item
				label="管理单位工商营业执照"
				className={css.item_file}
				name="businessLicense"
				tooltip="请上传管理单位工商营业执照（复印件、盖鲜章）"
				rules={[{ required: true, message: '管理单位工商营业执照不能为空' }]}
			>
				<Upload {...businessLicense}>
					<Button icon={<UploadOutlined />}>上传</Button>
				</Upload>
			</Form.Item>
			<Form.Item
				label="单位授权办件委托书"
				className={css.item_file}
				name="recommendation"
				tooltip="请上传经办人证明：单位授权办件委托书或介绍信（复印件、盖鲜章）"
				rules={[{ required: true, message: '单位授权办件委托书不能为空' }]}
			>
				<Upload {...recommendation}>
					<Button icon={<UploadOutlined />}>上传</Button>
				</Upload>
			</Form.Item>
			<Form.Item className={css.item_file}>
				<></>
			</Form.Item>
			<Form.Item
				label="建设工程规划竣工验收备案登记证"
				className={css.item_file}
				name="confirmationOfCompletion"
				rules={[{ required: true, message: '建设工程规划竣工验收备案登记证不能为空' }]}
			>
				<Upload {...confirmationOfCompletion}>
					<Button icon={<UploadOutlined />}>上传</Button>
				</Upload>
			</Form.Item>
			<Form.Item className={css.item_file}>
				<></>
			</Form.Item>
			<Form.Item className={css.item_file}>
				<></>
			</Form.Item>
			<Form.Item
				label="交通组织图"
				className={css.item_file}
				name="trafficOrganisationChart"
				tooltip="请上传停车场交通组织图,包括：标志出入口，标志标线，停车泊位设置等信息（复印件、盖鲜章）"
				rules={[{ required: true, message: '交通组织图不能为空' }]}
			>
				<Upload {...trafficOrganisationChart}>
					<Button icon={<UploadOutlined />}>上传</Button>
				</Upload>
			</Form.Item>
			<Form.Item className={css.item_file}>
				<></>
			</Form.Item>
			<Form.Item className={css.item_file}>
				<></>
			</Form.Item>
			<Form.Item
				label="停车场设施清单"
				className={css.item_file}
				name="parkLotSettingList"
				tooltip="停车场设施清单、立体机械式停车设备的特种设备注册登记证和质检部门出具的合格证书复印件壹份（复印件、盖鲜章）"
				rules={[{ required: true, message: '停车场设施清单不能为空' }]}
			>
				<Upload {...parkLotSettingList}>
					<Button icon={<UploadOutlined />}>上传</Button>
				</Upload>
			</Form.Item>
			<Form.Item className={css.item_file}>
				<></>
			</Form.Item>
			<Form.Item className={css.item_file}>
				<></>
			</Form.Item>
			<Form.Item
				label="经营服务及安全管理制度"
				className={css.item_file}
				name="serviceAndSafeSystem"
				tooltip="停车场管理制度（复印件、盖鲜章）:车辆停放、安全保卫、消防管理等方面的管理制度和安全防范措施及车库管理人员岗位职责等"
				rules={[{ required: true, message: '经营服务及安全管理制度不能为空' }]}
			>
				<Upload {...serviceAndSafeSystem}>
					<Button icon={<UploadOutlined />}>上传</Button>
				</Upload>
			</Form.Item>
			<Form.Item
				label="管理运营维护方案"
				className={css.item_file}
				name="manageOperateMaintainProject"
				tooltip="停车场管理制度（复印件、盖鲜章）:停车场管理运营维护方案、消防维保记录（复印件、盖鲜章）"
				rules={[{ required: true, message: '管理运营维护方案不能为空' }]}
			>
				<Upload {...manageOperateMaintainProject}>
					<Button icon={<UploadOutlined />}>上传</Button>
				</Upload>
			</Form.Item>
			<Form.Item
				label="应急处理预案"
				className={css.item_file}
				name="emergencyResponsePlan"
				tooltip="停车场管理制度（复印件、盖鲜章）:应急处置预案（复印件、盖鲜章）"
				rules={[{ required: true, message: '应急处理预案不能为空' }]}
			>
				<Upload {...emergencyResponsePlan}>
					<Button icon={<UploadOutlined />}>上传</Button>
				</Upload>
			</Form.Item>
			<Form.Item label="其他" className={css.item_file} name="others">
				<Upload {...others}>
					<Button icon={<UploadOutlined />}>上传</Button>
				</Upload>
			</Form.Item>
		</div>
	);
};
